<template>
<div><el-button type="primary" @click="dialogVisible = true">增加</el-button>
<el-dialog
  title="增加"
  :visible.sync="dialogVisible"
  :before-close="handleClose">
  <el-form
          :model="userForm" 
          status-icon
          ref="addForm"
          label-width="100px"
        >
          <el-form-item label="用户名">
            <el-input type="text" v-model="userForm.userName"></el-input>
          </el-form-item>
          <el-form-item label="密码">
            <el-input
              type="password"
              v-model="userForm.userPass"
              autocomplete="off"
            ></el-input>
          </el-form-item>
         
         
        </el-form>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="add">确 定</el-button>
  </span>
</el-dialog>
</div>
  
</template>

<script>
import { mapActions } from 'vuex';
import {register} from '../../service/user'
export default {
    data(){
        return {
            userForm:{},
            dialogVisible:false
        }
    },
    methods:{
        async add(){
            this.dialogVisible = false;
            let response = await register(this.userForm.userName,this.userForm.userPass);
            if(response != 1){
              alert(response.message);
              return;
            }
            this.setUsers();
        },
        ...mapActions('user',['setUsers'])
    }
}
</script>

<style>

</style>